<template>
  <div class="my-style1">
    <div style="width: 100%;text-align: center;">
      <div>此项目仅供个人学习使用，适合小白学些</div>
      <div>如无法下载demo请联系q1655710110</div>
    </div>
    <div style="display: flex;">
      <button class="def-btn">默认按钮样式</button>
      <div class="def-btn">默认按钮样式</div>
    </div>
    <div style="display: flex;">
      <div class="def-btn-small">小型默认按钮样式</div>
      <div class="def-btn-small" @click="toast('你好，欢迎使用')">吐司</div>
      <div class="def-btn-small" @click="showTipDialog({ title: '您的账号已在别处登录' })">提示框</div>
      <div class="def-btn-small" @click="loadShow()">加载框</div>
    </div>

  </div>
</template>
<script setup lang="ts" name="MyPage1">
import { hideLoading, showLoading } from '@/components/components/loadingdialog/my-loading-dialog';
import { showTipDialog } from '@/components/components/tipdialog/tip-dialog';
import { toast } from '@/components/components/toast/my-toast';
function loadShow() {
  showLoading()
  setTimeout(() => hideLoading(), 1000)
}

</script>
<style lang="css" scoped>
.my-style1 {
  height: 100%;
  display: flex;
  flex-direction: column;
}
</style>
